<template>
  <div class="home">
    <h2>Home View</h2>
    <h2>doubleCount: {{ counterStore.count }}</h2>
    <button @click="changeState">修改state</button>

    <!-- 展示数据 -->
    <h2>轮播的数据</h2>
    <ul>
      <template v-for="item in banners">
        <li>{{ item.title }}</li>
      </template>
    </ul>
  </div>
</template>

<script setup>
  import { storeToRefs } from 'pinia'
  import useCounter from '@/stores/modules/counter';
  import useHome from '@/stores/modules/home';
  
  const counterStore = useCounter()

  function changeState() {
    // counterStore.increment()
    // counterStore.incrementNum(10)
    counterStore.addSupper()
    console.log(counterStore.doubleCountAddOne);
    
  }

  const homeStore = useHome()
    // storeToRefs() 将store中的state转换为ref
    const { banners } = storeToRefs(homeStore)

console.log("banners:", banners)
  homeStore.fetchHomeMultidata().then(res => {
    console.log("fetchHomeMultidata的action已经完成了:", res)
  })



</script>

<style scoped>
</style>

